import React, { Component } from "react"
import TabControl from "./TabControl"

export class App extends Component {
    constructor() {
        super()
        this.state = {
            titles: ["流行", "新款", "精选"],
            // 控制内容显示
            tabIndex: 0,
        }
    }
    tabIndexChange(index) {
        console.log(index)
        this.setState({
            tabIndex: index,
        })
    }

    render() {
        const { titles, tabIndex } = this.state
        return (
            <div>
                <TabControl
                    titles={titles}
                    tabIndexChange={(index) => this.tabIndexChange(index)}
                />
                <h2>{titles[tabIndex]}</h2>
            </div>
        )
    }
}

export default App
